<template>
	<view class="me" :style="{'min-height': (getH()-44)+'px'}">
		<view class="baseMsg">
			<img src="../../static/imgs/man.png" alt="" v-if="user.sex=='男'">
			<img src="../../static/imgs/woman.png" alt="" v-if="user.sex=='女'">
			<img src="../../static/imgs/people.png" alt="" v-else>
			<view class="names">
				<view>
					<text>{{user.name}}</text>
					<text>{{user.tel}}</text>
				</view>
				<view>
					<text>{{user.age}}</text>
					<text>{{user.address}}</text>
				</view>
			</view>
		</view>
		<view class="someOrders">
			<text>我的地盘</text>
			<view class="domain">
				<view class="shezhi" @click="setMy()">
					<img src="../../static/icon/shezhi.png" alt="">
					<text>设置</text>
				</view>
				<view class="buyOrder" @click="toOrder()">
					<img src="../../static/icon/buyOreder.png" alt="">
					<text>我的订单</text>
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user:{
					name:'张三',
					tel:'15775407848',
					age:19,
					address:"新亚横街",
					sex:'',
				}
			}
		},
		methods: {
			getH(){
				return window.screen.height; 
			},
			setMy(){
				uni.navigateTo({
					url:'../../subpages/set/set?tel='+this.user.tel
				})
			},
			toOrder(){
				
				uni.switchTab({
					url:"../order/order"
				})
			},
		},
		onLoad() {
			uni.getStorage({
				key:"tel",
				success:(res)=>{
					// console.log(res.data)
					this.user.tel=res.data
				}
			})
		}
	}
</script>

<style scoped lang="less">
	.me{
		padding: 0 10px;
		display: flex;
		align-items: center;
		flex-direction: column;
		background: linear-gradient(to bottom,rgb(235,220,225),rgb(224,232,235)) ;
		.baseMsg{
			width: 100%;
			height: 200px;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			img{
				width: 60px;
				height: 60px;
				border-radius: 35px;
				margin: 0 20px 0 50px;
				box-shadow: 3px 3px 10px #999;
			}
			.names{
				flex: 1;
				display: flex;
				flex-direction: column;
				view{
					display: flex;
					margin-bottom: 10px;
					text{
						width: 30%;
					}
				}
			}
		}
		.someOrders{
			width: 100%;
			padding: 20px 0;
			border-radius: 20px;
			background-color: rgba(255,255,255,0.3);
			display: flex;
			flex-direction: column;
			text{
				padding: 0 20px;
				font-size: 18px;
				font-weight: bold;
			}
			.domain{
				display: flex;
				padding: 20px 0 0 0;
				.shezhi,.buyOrder{
					display: flex;
					flex-direction: column;
					align-items: center;
					flex:1;
					img{
						width: 50px;
						height: 50px;
						margin: 10px;
					}
					text{
						font-size: 14px;
						font-weight: 400;
						color: #999999;
					}
				}
				
			}
		}
	}
</style>
